<template>
  <view class="diagnosis-form">
    <!-- 标题 -->
    <view class="title">诊疗单</view>
	<!-- 判断是否有数据，如果没有则显示提示性文字 -->
	    <view v-if="dataList.length === 0" class="no-data" style="display: flex;justify-content: center;align-content: center;">暂时还没有诊疗数据</view>
    
    <!-- 使用v-for循环展示每个诊疗单 -->
    <view v-for="(diagnosis, index) in dataList" :key="index" class="diagnosis-item">
      <!-- 订单号 -->
      <view class="item">
        <view class="label">订单号：</view>
        <view class="value">{{ diagnosis.order_number }}</view>
      </view>
      
      <!-- 诊疗结果 -->
      <view class="item">
        <view class="label">诊疗结果：</view>
        <view class="value">{{ diagnosis.diagnosis_result }}</view>
      </view>
      
      <!-- 是否用药 -->
      <view class="item">
        <view class="label">是否用药：</view>
        <view class="value">{{ diagnosis.is_medication_required==1 ? '是' : '否' }}</view>
      </view>
      
      <!-- 用药详情 -->
      <view class="item" v-if="diagnosis.isMedicated">
        <view class="label">用药详情：</view>
        <view class="value">{{ diagnosis.medication_details }}</view>
      </view>
      
      <!-- 医生建议 -->
      <view class="item">
        <view class="label">医生建议：</view>
        <view class="value">{{ diagnosis.doctor_advice }}</view>
      </view>
    </view>
  </view>
</template>

<script>
  import config from '@/config/config.js'; // 引入全局配置文件
  export default {
    data() {
      return {
        dataList: [], // 数据列表
        dataLoading: true, // 数据加载状态
      }
    },
    onLoad(query) {
		uni.showToast({
			icon:'loading'
		})
      // 在页面加载时获取传递过来的参数
      const pet_id = query.pet_id;
    
      // 根据参数向数据库发起请求，获取数据
      // 这里使用 setTimeout 模拟异步请求
      setTimeout(() => {
        uni.request({
          url: config.baseURL + `/medicalRecord/getAllMedicalRecordsByPetId/${pet_id}`,
          method: 'GET',
          success: (res) => {
            this.dataList = res.data.data
          },
          fail: () => {
            uni.showToast({
              title: '请求失败，请检查网络连接',
              icon: 'none'
            });
          },
          complete: () => {
            this.dataLoading = false; // 数据加载完成，隐藏加载提示
          }
        });
      }, 1000);
    },
    methods: {
      
    }
  }
</script>

<style>
.diagnosis-form {
  padding: 20px;
  background-color: #fff; /* 更改背景色为白色 */
  border-radius: 10px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
}

.title {
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
}

.diagnosis-item {
  margin-bottom: 30px;
  border: 1px solid #ccc; /* 添加边框 */
  border-radius: 10px;
  padding: 20px;
}

.item {
  margin-bottom: 10px;
}

.label {
  font-weight: bold;
}

.value {
  margin-left: 10px;
}
</style>
